<template>
  <div class="outer-box">
     <TitleItem iconName="a-jiangpaijiangzhang" :hasBefore="false" :hasWhiteLine="true">引进人才</TitleItem>
      <div
    :style="{
      position:'absolute',
      float: 'left',
      width: '376px',
      height: '320px',
    }"
    class="border-box"
  >
    <div
      :style="{
        position:'relative',
        background: 'rgba(179, 57, 47, 0.6)',
        float: 'left',
        width: '356px',
        height: '300px',
        margin: '10px',
      }"
    >
      <div class="big">
        <div class="four">
          <div class="three">
            <div class="two">
              <div class="one">
                <div class="line1">院士 <br/>（4+5+4）</div>
              </div>
              <div class="line2">杰青和长江（9+8）</div>
            </div>
            <div class="line3">国家人才计划</div>
          </div>
          <div class="line4">山西省人才计划</div>
        </div>
      </div>
    </div>
  </div>
 </div>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
.outer-box{
    width: 320px * @topx;
    height: 427px * @topx;
}
.border-box{
    border: 4px solid #FEB3A9;
}
.big {
  width: 400px;
  height: 300px;
  margin: auto 0 ;
  position: absolute;
 transform: scale(0.9);
}
.line1 {
  height: 20px;
  width: 200px;
  color: aliceblue;
  position: relative;
  text-align: center;
  top: 30px;
  left: -100px;
}
.line2 {
  height: 20px;
  width: 200px;
  color: aliceblue;
  position: relative;
  top: 15px;
  left: -55px;
}
.line3 {
  height: 20px;
  width: 200px;
  color: aliceblue;
  position: relative;
  top: 20px;
  left: -50px;
}
.line4 {
  height: 20px;
  width: 200px;
  color: aliceblue;
  position: relative;
  top: 20px;
  left: -60px;
}
.one {
  width: 0;
  height: 0;
  border-width: 0px 60px 90px 60px;
  border-style: solid;
  border-color: rgba(256, 256, 256,0) rgba(256, 256, 256,0) #FFAF84 rgba(256, 256, 256,0);
  position: relative;
    left: -60px;
 margin: auto 0;
}
.two {
  width: 0;
  height: 0;  
  border: 90px solid transparent;
  border-width: 0px 100px 150px 100px;
  border-style: solid;
  border-color: rgba(256, 256, 256,0) rgba(256, 256, 256,0) #FC610F rgba(256, 256, 256,0);
  position: relative;
  left: -100px;
     margin: auto 0;
}
.three {
  width: 0;
  height: 0;
  border: 135px solid transparent;
  border-width: 0px 140px 210px 140px;
  border-style: solid;
  border-color: rgba(256, 256, 256,0) rgba(256, 256, 256,0) #FF2A1A rgba(256, 256, 256,0);
  position: relative;
  left: -140px;
 margin: auto 0;
}
.four {
  width: 0;
  height: 0;
  border-width: 0px 180px 270px 180px;
  border-style: solid;
  border-color: rgba(256, 256, 256,0) rgba(256, 256, 256,0) #DF0F07 rgba(256, 256, 256,0);
  margin:  auto 0;
  position: relative;
  top: 20px;
}
</style>